<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="UTF-8">
    <title>立项管理</title>
    <link rel="stylesheet" href="../style/bootstrap.min.css"/>
    <script type="text/javascript" src="../scripts/jquery.js"></script>
    <script type="text/javascript" src="../scripts/bootstrap.min.js"></script>


    <script>
        //获取指定form中的所有的<input>对象
        function getElements(formId) {
            var form = document.getElementById(formId);
            var elements = new Array();
            var tagElements = form.getElementsByTagName('input');
            for (var j = 0; j < tagElements.length; j++) {
                elements.push(tagElements[j]);

            }
            return elements;
        }

        //获取单个input中的【name,value】数组
        function inputSelector(element) {
            if (element.checked)
                return [element.name, element.value];
        }

        function input(element) {
            switch (element.type.toLowerCase()) {
                case 'submit':
                case 'hidden':
                case 'password':
                case 'text':
                    return [element.name, element.value];
                case 'checkbox':
                case 'radio':
                    return inputSelector(element);
            }
            return false;
        }

        //组合URL
        function serializeElement(element) {
            var method = element.tagName.toLowerCase();
            var parameter = input(element);

            if (parameter) {
                var key = encodeURIComponent(parameter[0]);
                if (key.length == 0) return;

                if (parameter[1].constructor != Array)
                    parameter[1] = [parameter[1]];

                var values = parameter[1];
                var results = [];
                for (var i = 0; i < values.length; i++) {
                    results.push(key + '=' + encodeURIComponent(values[i]));
                }
                return results.join('&');
            }
        }

        //调用方法
        function serializeForm(formId) {
            var elements = getElements(formId);
            var queryComponents = new Array();

            for (var i = 0; i < elements.length; i++) {
                var queryComponent = serializeElement(elements[i]);
                if (queryComponent)
                    queryComponents.push(queryComponent);
            }

            return queryComponents.join('&');
        }

    </script>

    <script>
        function getFormInfo() {
            var params = serializeForm('unitId');
            document.getElementById("unit").value = params;
        }

        function getFormInfo2() {
            var params = serializeForm('checkItemForm');
            document.getElementById("item").value = params;
        }
    </script>
</head>

<body>
<div class="container">
    <div class="row">
        <form action="/Projects/liItem" method="post">
            <table class="table table-striped table-hover table-condensed">
                <input type="hidden" id="unit" name="unit"/>
                <input type="hidden" id="item" name="item"/>
                <tr>
                    <td> 项目名称：<input type="text" name="name"/></td>
                    <td> 项目类型：
                        <select name="type">
                            <option class="active" value="2">营业类</option>
                            <option value="1" data-toggle="modal" data-target="#checkitem">公司类</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        被审单位：
                        <select class="ui_select01" name="review">
                            <option class="active" th:each="ins:${institutions}"
                                    th:text="${ins.auditname}"
                                    th:value="${ins.id}"></option>
                        </select>
                        <input type="button" class="btn-primary" value="抽取单位配置" data-toggle="modal"
                               data-target="#choudan">
                    </td>
                </tr>
                <tr>
                    <td>
                        审计时间起：
                        <input type="text" name="stime"/>
                    </td>
                    <td>
                        审计时间止：
                        <input type="text" name="etime"/>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        项目阶段：
                        <input class="active" type="radio" name="phase" value="1"/>仅非现场阶段
                        <input type="radio" name="phase" value="2"/>仅现场阶段
                        <input type="radio" name="phase" value="0"/>全部
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="submit" value="下一步"/>
                    </td>
                    <td>
                        <input type="reset" value="重置"/>
                    </td>
                </tr>
            </table>
        </form>

    </div>
</div>

<!--抽取单位配置的模态框-->
<div class="modal fade" id="choudan" style="margin-left: -600px">
    <div class="modal-dialog">
        <div class="modal-content" style="width: 200%;">
            <div class="modal-header">
                <button class="close" data-dismiss="modal">×</button>
                <h4>抽取单位配置</h4>
            </div>
            <form id="unitId" action="">
                <div class="media-body container">
                    <table class="unit-the-table table">
                        <tr>
                            <td></td>
                            <td>分支机构</td>
                            <td>抽取时间起</td>
                            <td>抽取时间终</td>
                            <td>成立时间</td>
                            <td>上次稽核时间</td>
                            <td>上级营业部</td>
                            <td>下级营业部</td>
                            <td>项目类型</td>
                        </tr>
                        <tr th:each="units:${units}">
                            <input type="hidden" name="id" th:value="${id}">
                            <td><input type="checkbox" name="unit" th:value="${units.id}"></td>
                            <td th:text="${units.branch}">xx</td>
                            <td th:text="${units.sdrawtime}"></td>
                            <td th:text="${units.edrawtime}"></td>
                            <td th:text="${units.settime}">xx</td>
                            <td th:text="${units.lasttime}">xx</td>
                            <td th:text="${units.supsal}">xx</td>
                            <td th:text="${units.subsal}">xx</td>
                            <td th:text="${units.ptype}">xx</td>
                        </tr>
                    </table>
                </div>
                <div class="modal-footer">
                    <input type="button" class="btn btn-info btn-block" value="保存" onclick="getFormInfo()"
                           data-dismiss="modal"/>
                </div>
            </form>
        </div>
    </div>
</div>
<!--结束-->

<!--检查项的模态框-->
<div class="modal fade" id="checkitem">
    <div class="modal-dialog">
        <div class="modal-content" style="width: 450px;">
            <div class="modal-header">
                <button class="close" data-dismiss="modal">×</button>
                <h4>检查项</h4>
            </div>
            <form id="checkItemForm" action="#">
                <div class="media-body container">
                    <table class="unit-the-table table">
                        <tr>
                            <td>
                            </td>
                            <td>
                                <span>检查项</span>
                            </td>
                        </tr>
                        <tr th:each="Items:${checkItems}">
                            <td><input name="item" type="checkbox" th:value="${Items.id}"/></td>
                            <td>
                                <span th:text="${Items.item}">Items</span>
                            </td>
                        </tr>
                    </table>
                </div>
                <div class="modal-footer">
                    <input type="button" class="btn btn-info btn-block" value="保存" onclick="getFormInfo2()"
                           data-dismiss="modal"/>
                    <input type="reset" class="btn btn-warning btn-block" value="重置"/>
                </div>
            </form>
        </div>
    </div>
</div>
<!--结束-->
</body>

</html>